import { clientSetting } from '@/config/client-setting'

const themeMap = new Map([
  ['dark', {
    bgColor: '#26497F', // 背景色
    textColor: '#FFFFFFB3', // 导航文字颜色
    headerActiveTextColor: '#f6ca9d', // header导航选中文字颜色
    sideActiveTextColor: '#535862', // 侧边栏导航选中文字颜色
    headerIconColor: '#fff', // header图标按钮颜色
    headerIconHoverBgColor: 'hsl(0deg 0% 100% / 5%)' // header图标按钮hover背景色
  }],
  ['light', {
    headerIconColor: '#333', // header图标按钮颜色
    headerIconHoverBgColor: '#f8f8f9' // header图标按钮hover背景色
  }]
])

export const useThemes = () => {
  const style = clientSetting.themes
  return {
    bgColor: themeMap.get(style)?.bgColor,
    textColor: themeMap.get(style)?.textColor,
    headerActiveTextColor: themeMap.get(style)?.headerActiveTextColor,
    sideActiveTextColor: themeMap.get(style)?.sideActiveTextColor,
    headerIconColor: themeMap.get(style)?.headerIconColor,
    headerIconHoverBgColor: themeMap.get(style)?.headerIconHoverBgColor,
    themeClass: `theme-${style}`
  }
}
